<template>
	<view v-if="msg==''">
		<xbd-zwnz marginTop='200'></xbd-zwnz>
	</view>
	<view v-else class="center">
		<view class="title">
			{{msg.title}}
		</view>
		<view class="details">
			<view class="">
				<view class="tag">
					发布人：{{msg.creator}}
				</view>
				<view class="tag">
					发布时间：{{msg.time | timeFormat('YYYY-MM-DD HH:mm')}}
				</view>
			</view>
		</view>
		<view>
			<!-- <uni-easyinput disabled type="text" :value="msg.content" ></uni-easyinput> -->
			<!-- <textarea disabled redonly class="showText" placeholder-style="font-size: 30rpx; color: #000623;"
				:value="msg.content" auto-height maxlength='-1'></textarea> -->
			<!-- <textarea name="" id="" cols="30" rows="10"></textarea> -->
			<text>{{ msg.content}}</text>
		</view>
		<xbd-button v-if="!state" text="确认" @clickBtn="cancel()"></xbd-button>
	</view>
</template>

<script>
	import {
		Personalcenter
	} from '@/api/index.js';
	export default {
		data() {
			return {
				msg: '',
				state: true,
			};
		},
		methods: {
			async cancel() {
				const res = await Personalcenter.posMessageRead(this.id)
				if (res.success) {
					this.state = true
					uni.$emit('isread', this.id)
				}
				this.$showToast(res.msg);
			},
			async init() {
				const res = await Personalcenter.getMessageDetail(this.id)
				this.msg = res.data.detail
				this.state = res.data.state
				if(res.code == 9007){
					this.$showToast(res.msg);
				}
				console.log(res, 'res')
			}
		},
		onLoad(res) {
			this.id = res.id
			this.init()
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep textarea:disabled {
		opacity: 1;
		-webkit-text-fill-color: #222222;
	}

	.showText {
		font-size: 30rpx;
		color: #000623 !important;
		background-color: transparent;
	}

	.center {
		padding: 32rpx;
		color: #000623;
		font-size: 30rpx;
		line-height: 52rpx;

		.title {
			font-family: PingFang SC, PingFang SC-Heavy;
			font-weight: 800;
			line-height: 56rpx;
			font-size: 32rpx;
			color: #000623;
			text-align: justify;
			word-wrap: break-word;
		}

		.details {
			margin-top: 20rpx 0;
			padding-bottom: 40rpx;
			display: flex;
			justify-content: space-between;
			font-size: 26rpx;
			color: #8890A5;
			align-items: center;
			border-bottom: 2rpx solid #EBEEF5;

			.tag {
				margin-bottom: 10rpx;
			}
		}
	}
</style>
